<template>
    <view>
        <view v-if="id && isLoad === null" class="margin-top load notexist text-l text-grey"></view>
        <view v-if="id && isLoad === false" class="margin-top load loading text-l text-grey"></view>
        <block v-if="isWork && isLoad">
            <view class="main-work">
                <!-- parse <include src="../../../admin/meet/add/admin_meet_form_tpl.wxml"/> -->
                <block>
                    <view class="form-box shadow">
                        <view class="form-group">
                            <view class="title must">老师名称</view>
                            <input placeholder="请输入老师的名称" placeholder-class="phc" v-model="formTitle" :focus="formTitleFocus" maxlength="50" />
                        </view>
                        <view v-if="formTitleFocus" class="hint-desc error">{{ formTitleFocus }}</view>

                        <view v-if="cateIdOptions.length > 1 && isAdmin" class="form-group arrow" id="formCateId">
                            <view class="title must">分类</view>
                            <cmpt-picker
                                id="cate-picker"
                                :sourceData="cateIdOptions"
                                @select="url($event, { type: 'picker', item: 'formCateId', tagId: 'cate-picker' })"
                                data-type="picker"
                                data-item="formCateId"
                                :item="formCateId"
                            ></cmpt-picker>
                        </view>
                        <view v-if="formCateIdFocus" class="hint-desc error">{{ formCateIdFocus }}</view>

                        <view class="form-group" v-if="isAdmin">
                            <view class="title must">
                                排序号
                                <text class="text-grey text-normal margin-left-xs">(小的先显示)</text>
                            </view>
                            <input placeholder="排序号，小的先显示" type="number" placeholder-class="phc" v-model="formOrder" :focus="formOrderFocus" maxlength="4" />
                        </view>
                        <view v-if="formOrderFocus" class="hint-desc error">{{ formOrderFocus }}</view>

                      <view class="form-group" id="formCancelSet">
                        <view class="title must">取消设置</view>
                          <cmpt-picker mark="cancelSet" style="flex: 1" labelKey="label" sourceDataStr="0=不可取消,1=随时可取消,2=仅开始前可取消" />
                      </view>
                        <view v-if="formCancelSetFocus" class="hint-desc error">{{ formCancelSetFocus }}</view>
                    </view>

                    <view id="formDaysSet" class="form-box shadow" style="background-color: #fef2ce">
                        <view @tap="url" :data-url="'../time/' + (isAdmin ? 'admin' : 'work') + '_meet_time'" class="form-group arrow">
                            <view class="title must">预约时段排期设置</view>
                            <view v-if="formDaysSet.length" class="form-text text-red text-bold">{{ formDaysSet.length }}天可约</view>
                            <view v-else class="form-text text-orange">请配置可预约时段</view>
                        </view>
                        <view v-if="formDaysSetFocus" class="hint-desc error">{{ formDaysSetFocus }}</view>
                    </view>

                    <view id="formPhone" class="form-box shadow">
                        <view class="form-group">
                            <view class="title must">老师登录手机</view>
                            <input maxlength="11" type="number" placeholder="请填写登录手机号码" v-model="formPhone" :focus="formPhoneFocus" />
                        </view>
                        <view v-if="formPhoneFocus" class="hint-desc error">{{ formPhoneFocus }}</view>

                        <view class="form-group text-orange" v-if="isAdmin && isEdit">
                            <text class="icon-info" style="font-size: 24rpx">不修改密码则保持以下为空</text>
                        </view>
                        <view class="form-group">
                            <view class="title must">老师登录密码</view>
                            <input maxlength="30" placeholder="请填写登录密码" v-model="formPassword" :focus="formPasswordFocus" />
                        </view>
                        <view v-if="formPasswordFocus" class="hint-desc error">{{ formPasswordFocus }}</view>
                    </view>

                    <view class="form-box shadow margin-top-xs">
                        <cmpt-form-show
                            id="cmpt-form"
                            mark="cmpt-form"
                            source="admin"
                            :isCacheMatch="false"
                            :fields="fields"
                            :forms="formForms"
                            :isDefMatch="id ? false : true"
                        ></cmpt-form-show>
                    </view>

                    <view class="form-box shadow" v-if="isAdmin">
                        <view class="form-group">
                            <view class="title must">
                                预约用户填写数据项目
                                <text class="text-grey text-normal">(共{{ formJoinForms.length }}个字段)</text>
                            </view>
                        </view>
                        <cmpt-form-set id="form-set" @formset="bindJoinFormsCmpt($event, { tagId: 'form-set' })" :fields="formJoinForms" />
                    </view>
                </block>

                <button @tap="bindFormEditSubmit" class="btn-work margin-top-l">保存</button>
            </view>
        </block>
    </view>
</template>

<script>
import cmptFormSet from '@/cmpts/public/form/form_set/form_set_cmpt';
import cmptFormShow from '@/cmpts/public/form/form_show/form_show_cmpt';
import cmptPickerTime from '@/cmpts/public/picker_time/picker_time_cmpt';
import cmptPickerMulti from '@/cmpts/public/picker_multi/picker_multi_cmpt';
import {getWorkInfo} from "../../../../api/workapi";
const WorkBiz = require('@/utils/biz/work_biz.js');
const pageHelper = require('@/utils/helper/page_helper.js');
const cloudHelper = require('@/utils/helper/cloud_helper.js');
const validate = require('@/utils/helper/validate.js');
const AdminMeetBiz = require('@/utils/biz/admin_meet_biz.js');
const api = require('@/api/workapi.js');

export default {
    components: {
        cmptFormSet,
        cmptFormShow,
        cmptPickerTime,
        cmptPickerMulti
    },
    data() {
        return {
            isLoad: false,
            id: '',
            teacherId:'',
            formTitle: '',
            formCateId: '',
            formOrder: '',
            formCancelSet: '',
            formPhone: '',
            formForms: '',
            formDaysSet: '',
            formJoinForms: '',
            isWork: '',
            formTitleFocus: null,
            cateIdOptions: [],
            isAdmin: false,
            testSourceList:['形式1','形式2','形式33'],
            formCateIdFocus: null,
            formOrderFocus: null,
            formCancelSetFocus: '',
            formDaysSetFocus: '',
            formPhoneFocus: '',
            isEdit: '',
            formPassword: '',
            formPasswordFocus: '',
            fields: ''
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: async function (options) {
        if (!WorkBiz.isWork(this)) {
            return;
        }
        // this.setData({
        //     id: WorkBiz.getWorkId()
        // });
        this.id = options.id;
        this.setData(await AdminMeetBiz.initFormData()); // 初始化表单数据

        await this.loadDetailFun();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: async function () {
        await this.loadDetailFun();
        uni.stopPullDownRefresh();
    },
    methods: {
        loadDetailFun: async function () {
            let id = this.id;
            if (!id) {
                return;
            }
            let params = {
                id
            };
            let opt = {
                title: 'bar'
            };
            let meetData = await api.getWorkDetail(params);
            // let meet = await cloudHelper.callCloudData('work/meet_detail', params, opt);
            if (!meetData) {
                this.setData({
                    isLoad: null
                });
                return;
            }
            this.setData({
                isLoad: true,
                // 表单数据
                teacherId:meetData.id,
                formTitle: meetData.title,
                formCateId: meetData.cateId,
                formOrder: meetData.order,
                formCancelSet: meetData.cancelSet,
                formPhone: meetData.phone,
                formForms: meetData.forms || [],
                formDaysSet: meetData.daysSet || [],
                formJoinForms: meetData.joinForms || []
            });
            // this.setData({
            //     isLoad: true,
            //     // 表单数据
            //     formTitle: meet.teacherName,
            //     formCateId: meet.MEET_CATE_ID,
            //     formOrder: meet.MEET_ORDER,
            //     // formCancelSet: '',
            //     formPhone: meet.phone,
            //     formForms: meet.MEET_FORMS,
            //     formDaysSet: meet.meetDays,
            //     // formJoinForms: meet.MEET_JOIN_FORMS
            // });
        },

        bindJoinFormsCmpt: function (e, _dataset) {
            /* ---处理dataset begin--- */
            this.handleDataset(e, _dataset);
            /* ---处理dataset end--- */
            this.setData({
                formJoinForms: e.detail
            });
        },

        bindFormEditSubmit: async function () {
            pageHelper.formClearFocus(this);
            if (!WorkBiz.isWork(this)) {
                return;
            }
            let data = this;
            if (data.formDaysSet.length <= 0) {
                pageHelper.anchor('formDaysSet', this);
                return pageHelper.formHint(this, 'formDaysSet', '请配置「可预约时段」');
            }
            if (data.formJoinForms == null || data.formJoinForms == undefined) {
                return pageHelper.showModal('请设置「用户填写资料」');
            }
            if (data.formJoinForms.length <= 0) {
                return pageHelper.showModal('请至少设置一项「用户填写资料」');
            }
            data = validate.check(data, AdminMeetBiz.CHECK_FORM, this);
            if (!data) {
                return;
            }
            let forms = this.zpSelectComponent('#cmpt-form').getForms(true);
            if (!forms) {
                return;
            }
            data.forms = forms;
            data.cateName = AdminMeetBiz.getCateName(data.cateId);
            try {
                let meetId = this.id;
                data.id = this.teacherId;
                
                  api.updateWorkInfo(data).then(res => {
                    console.log('res', res);
                });
                // 先修改，再上传
                // await cloudHelper.callCloudSumbit('work/meet_edit', data);

                // // 图片
                // await cloudHelper.transFormsTempPics(forms, 'meet/', meetId, 'work/meet_update_forms');
                let callback = async function () {
                    uni.navigateBack();
                };
                pageHelper.showSuccToast('编辑成功', 2000, callback);
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        },

        url: function (e, _dataset) {
            /* ---处理dataset begin--- */
            this.handleDataset(e, _dataset);
            /* ---处理dataset end--- */
            pageHelper.url(e, this);
        }
    }
};
</script>
<style>
@import './work_meet_edit.css';
</style>
